<template>
  <div>
    <el-divider>基本信息</el-divider>
    <el-descriptions direction="vertical" :column="10" border>
      <el-descriptions-item label="标题">{{ taskObj.title || '-' }}</el-descriptions-item>
      <el-descriptions-item label="计划编号">{{ taskObj.planNum || '-' }}</el-descriptions-item>
      <el-descriptions-item label="任务编号">{{ taskObj.taskNum || '-' }}</el-descriptions-item>
      <el-descriptions-item label="盘点范围">{{ taskObj.stktakingDeptName || '-' }}</el-descriptions-item>
      <el-descriptions-item label="计划盘点时间">{{ taskObj.planStartTime || '-' }}~{{ taskObj.planEndTime || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="任务责任部门">{{ taskObj.deptName || '-' }}</el-descriptions-item>
      <el-descriptions-item label="任务责任人">{{ taskObj.headName || '-' }}</el-descriptions-item>
      <el-descriptions-item label="盘点方式">{{ ['全盘盘点', '比例盘点'][taskObj.type] || '-' }}</el-descriptions-item>
      <el-descriptions-item label="盘点比例">{{ taskObj.type === '0' ? '-' : taskObj.proportion * 100 + '%' || '0%' }}
      </el-descriptions-item>
      <el-descriptions-item label="盘点对象生成方式">{{ ['随机生成', '手动生成'][taskObj.generationType] || '-' }}
      </el-descriptions-item>
    </el-descriptions>
    <el-divider>盘点信息</el-divider>
    <el-table v-loading="loading" @filter-change="filterChange" ref="multipleTable" :data="tableData">
      <el-table-column label="序号" align="center" width="50">
        <template slot-scope="scope">
          {{ scope.$index + 1 || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="资产编号" align="center" min-width="150">
        <template slot-scope="scope">
          {{ scope.row.assetNum || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="设备编号" align="center" min-width="150">
        <template slot-scope="scope">
          {{ scope.row.equipmentNum || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="设备名称" align="center" min-width="130">
        <template slot-scope="scope">
          {{ scope.row.equipmentName || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="负责人" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.headName || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="品牌" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.brand || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="规格型号" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.model || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="所属部门" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.deptName || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="台账位置" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.placeName || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="盘点状态" :filter-multiple="false" :filters="filtersStatus" align="center" min-width="120">
        <template slot-scope="scope">
          <div :style="'color:' + ['#F56C6C', '#67C23A', '#E6A23C', '#F56C6C'][scope.row.status]">
            <!-- <i :class="['el-icon-success', 'el-icon-remove'][scope.row.status]" /> -->
            <span>
              {{ ['未盘点', '已盘点', '盘亏', '位置异常'][scope.row.status] || '-' }}
            </span>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="盘点人" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.checkerName || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="盘点时间" align="center" min-width="160">
        <template slot-scope="scope">
          {{ scope.row.checkTime || '-' }}
        </template>
      </el-table-column>
      <el-table-column label="说明" align="center" min-width="120">
        <template slot-scope="scope">
          {{ scope.row.remark || '-' }}
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />
  </div>
</template>

<script>
import { getTaskList, getbyDeptIdsTaskList } from "@/api/Inventory/Inventory.js";
export default {
  props: ['rowObj'],
  data () {
    return {
      taskObj: {},
      tableData: [],
      loading: false,
      activeName: undefined,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        orderByColumn: 'equipmentAccountId',
        isAsc: 'desc'//倒叙
      },
      total: 0
    }
  },
  computed: {
    filtersStatus () {
      return [
        { text: '未盘点', value: '0' },
        { text: '已盘点', value: '1' },
        { text: '盘亏', value: '2' },
        { text: '位置异常', value: '3' },
      ]
    }
  },
  created () {
    this.getList()
    this.getbyDeptIds()
  },
  watch: {
  },
  methods: {
    async getbyDeptIds () {
      let params = await getTaskList(this.rowObj.taskId);
      this.taskObj = params.data
    },
    async getList () {
      this.loading = true
      let promise = {
        ...this.queryParams,
        taskId: this.rowObj.taskId
      }
      promise = this.activeName ? { ...promise, status: this.activeName } : { ...promise }
      let data = await getbyDeptIdsTaskList(promise);
      this.tableData = data.data
      this.total = data.total
      this.loading = false
      return false
    },
    filterChange (filterCondition) {
      for (const key in filterCondition) {
        const element = filterCondition[key][0];
        this.activeName = element
        this.getList()
        return
      }
    }
  }
}
</script>

<style lang="scss" scoped>
</style>